<!--
Copyright (c) 2012 
Ulf Björklund
http://average-uffe.blogspot.com/
http://twitter.com/codeplanner
http://twitter.com/ulfbjo

Permission is hereby granted, free of charge, to any person obtaining
a copy of this software and associated documentation files (the
"Software"), to deal in the Software without restriction, including
without limitation the rights to use, copy, modify, merge, publish,
distribute, sublicense, and/or sell copies of the Software, and to
permit persons to whom the Software is furnished to do so, subject to
the following conditions:

The above copyright notice and this permission notice shall be
included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
//-->
@{
    ViewBag.Title = "SinglePage";
}
@if (false)
{ 
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.6.4.min.js"></script>
    <script src="/Scripts/knockout-2.0.0.js" type="text/javascript"></script>           
}
@section JavaScript{
    <script type="text/javascript">

        //Entity, Scaffolded!!!
        var MessageExpertUserEntity = function () {
            this.Id = 0;
            this.Created = null;
						this.Updated = ko.observable();
						this.IsRead = ko.observable();
						this.IsStarred = ko.observable();
						this.IsSender = ko.observable();
						this.MessageId = ko.observable();
						this.ExpertProfileId = ko.observable();
						this.MessageFolderId = ko.observable();
									this.Message = ko.observable();			
						this.ExpertProfile = ko.observable();			
						this.MessageFolder = ko.observable();			
						        };

        $(function () {
            //Setup viewmodel and trigger knockoutjs
            ViewModel.Debug = debugEnabled;
            ViewModel.Setup("MessageExpertUser", MessageExpertUserEntity, function () {
                var cmd = getQuerystring("cmd", null);
                var id = getQuerystring("id", null);
                var sender = getQuerystring("sender", null);
                if (cmd == 'add') {
                    ViewLogic.ShowAddDialog(id,sender);
                }
                if (cmd == 'details') {
                    if (id != null) {
                        ViewModel.Activate(id);
                        ViewLogic.ShowDetails();
                    }
                }
                if (cmd == 'delete') {
                    if (id != null) {
                        ViewModel.Activate(id);
                        ViewLogic.ShowDeleteDialog();
                    }
                }
                if (cmd == 'edit') {
                    if (id != null) {
                        ViewModel.Activate(id);
                        ViewLogic.ShowEditDialog();
                    }
                }
				if (cmd == "index" || cmd == "") {
                    ViewLogic.ShowIndex();
                }
            });            
        });

       var ViewLogic = {
            ShowAddDialog: function (id, sender) {
                $("#details").hide();
                LoadParentAddData(id, sender, function () { $('#dialog-modal-add').modal('show'); });
            },
            ShowEditDialog: function () {
                $("#details").hide();
                LoadParentEditData(function () { $('#dialog-modal-edit').modal('show'); });
            },
            HideAddDialog: function () {
                $('#dialog-modal-add').modal('hide');
            },
            HideEditDialog: function () {
                $('#dialog-modal-edit').modal('hide');
            },
            ShowDeleteDialog: function () {
                $("#details").hide();
                $('#dialog-modal-delete').modal('show');
            },
            HideDeleteDialog: function () {
                $('#dialog-modal-delete').modal('hide');
            },
            ShowDetails: function () {                
                $("#index").hide();
                $("#details").show();                
            },
            ShowIndex: function () {
                $("#details").hide();
                $("#index").show();
            },
            SaveDialogCommit: function (formElement) {
                ViewModel.Add($(formElement).serialize(), function (result) {
                    ViewLogic.HideAddDialog();                    
                    for (p in result) {
                        $("#" + p, "#dialog-modal-add").parent().removeClass('error');
                        $("#" + p, "#dialog-modal-add").val('');
                        $("#" + p, "#dialog-modal-add").popover('disable');
                    }
                }, function (result) {
                    for (p in result.ValidationErrors) {
                        $("#" + p, "#dialog-modal-add").parent().addClass('error');
                        $("#" + p, "#dialog-modal-add").data('title', 'Validation Error');
                        $("#" + p, "#dialog-modal-add").data('content', result.ValidationErrors[p].join(','));
                        $("#" + p, "#dialog-modal-add").popover();
                    }
                });
            },
            UpdateDialogCommit: function (formElement) {
                ViewModel.Update($(formElement).serialize(), function (result) {
                    ViewLogic.HideEditDialog();
                    for (p in result) {
                        $("#" + p, "#dialog-modal-edit").parent().removeClass('error');
                        $("#" + p, "#dialog-modal-edit").val('');
                        $("#" + p, "#dialog-modal-edit").popover('disable');
                    }
                }, function (result) {                    
                    for (p in result.ValidationErrors) {
                        $("#" + p, "#dialog-modal-edit").parent().addClass('error');
                        $("#" + p, "#dialog-modal-edit").data('title', 'Validation Error');
                        $("#" + p, "#dialog-modal-edit").data('content', result.ValidationErrors[p].join(','));
                        $("#" + p, "#dialog-modal-edit").popover();
                    }
                });
            },
            DeleteDialogCommit: function () {
                ViewModel.Remove(ViewModel.Entity());
                ViewLogic.HideDeleteDialog();
            },
            ChangePage: function (entityName, cmd, id, sender) {
                window.location.href = "/" + entityName + "/SinglePage?cmd=" + cmd + "&id=" + id + "&sender=" + sender;
            }
        };

		var LoadParentEditData = function(callback){					 
						$("#dialog-modal-add #MessageId").empty();
            RelatedData.Load("Message", function (data) {
                $.when($.each(data, function (ix, value) {
                   var o = $("<option>").attr('value', value.Id).text(value.Name);
                   $("#dialog-modal-edit #MessageId").append(o);
                })).done(function () {
                   $("#dialog-modal-edit #MessageId").val(ViewModel.Entity().MessageId());                        
                });
             });
						$("#dialog-modal-add #ExpertProfileId").empty();
            RelatedData.Load("ExpertProfile", function (data) {
                $.when($.each(data, function (ix, value) {
                   var o = $("<option>").attr('value', value.Id).text(value.Name);
                   $("#dialog-modal-edit #ExpertProfileId").append(o);
                })).done(function () {
                   $("#dialog-modal-edit #ExpertProfileId").val(ViewModel.Entity().ExpertProfileId());                        
                });
             });
						$("#dialog-modal-add #MessageFolderId").empty();
            RelatedData.Load("MessageFolder", function (data) {
                $.when($.each(data, function (ix, value) {
                   var o = $("<option>").attr('value', value.Id).text(value.Name);
                   $("#dialog-modal-edit #MessageFolderId").append(o);
                })).done(function () {
                   $("#dialog-modal-edit #MessageFolderId").val(ViewModel.Entity().MessageFolderId());                        
                });
             });
						
						callback();
		};
		
		var LoadParentAddData = function(id, sender, callback){
			//for each parent, load data
									$("#dialog-modal-add #MessageId").empty();
					RelatedData.Load("Message", function (data) {
                    $.when($.each(data, function (ix, value) {
                        var o = $("<option>").attr('value', value.Id).text(value.Name);
                        $("#dialog-modal-add #MessageId").append(o);
                        //$("#dialog-modal-add #Message").val(value.Id);                        
                    })).done(function () {                        
                        if (id != null && sender == "Message") {
                        	$("#dialog-modal-add #MessageId").val(id);
                    	}
                    });
                });				
									$("#dialog-modal-add #ExpertProfileId").empty();
					RelatedData.Load("ExpertProfile", function (data) {
                    $.when($.each(data, function (ix, value) {
                        var o = $("<option>").attr('value', value.Id).text(value.Name);
                        $("#dialog-modal-add #ExpertProfileId").append(o);
                        //$("#dialog-modal-add #ExpertProfile").val(value.Id);                        
                    })).done(function () {                        
                        if (id != null && sender == "ExpertProfile") {
                        	$("#dialog-modal-add #ExpertProfileId").val(id);
                    	}
                    });
                });				
									$("#dialog-modal-add #MessageFolderId").empty();
					RelatedData.Load("MessageFolder", function (data) {
                    $.when($.each(data, function (ix, value) {
                        var o = $("<option>").attr('value', value.Id).text(value.Name);
                        $("#dialog-modal-add #MessageFolderId").append(o);
                        //$("#dialog-modal-add #MessageFolder").val(value.Id);                        
                    })).done(function () {                        
                        if (id != null && sender == "MessageFolder") {
                        	$("#dialog-modal-add #MessageFolderId").val(id);
                    	}
                    });
                });				
				   
				
								callback();
		};
        var RelatedData = {
            Load: function (entityName, callback) {
                $.getJSON("/" + entityName + "/GetAll/", {}, function (data) {
                    callback(data);
                });
            }
        };  
        
    </script>
}
<div id="index">
    <div>
        <ul class="nav nav-tabs">
            <li class="active"><a href="#tabs-1">MessageExpertUser</a></li>
        </ul>
        <div class="tab-content">
            <div class="tab-pane active" id="tabs-1">
                <a data-toggle="modal" href="#dialog-modal-add" class="btn btn-primary btn-medium" data-bind="click: function(){ LoadParentAddData(null,'',function(){});}">
                        Add MessageExpertUser</a>
            </div>
            <table class="table table-condensed">
                <thead>
                    <tr>
												<th>
                            Id
                        </th>						
												<th>
                            IsRead
                        </th>						
												<th>
                            IsStarred
                        </th>						
												<th>
                            IsSender
                        </th>						
																		<th>
						Message 
						</th>
												<th>
						ExpertProfile 
						</th>
												<th>
						MessageFolder 
						</th>
																								<th>
                            Created
                        </th>						
												<th>
                            Updated
                        </th>						
						                        <th>
                        </th>
                    </tr>
                </thead>
                <tbody data-bind="foreach: Entities">
                    <tr>
												<td data-bind="text: Id">
                        </td>											
												<td data-bind="text: IsRead">
                        </td>											
												<td data-bind="text: IsStarred">
                        </td>											
												<td data-bind="text: IsSender">
                        </td>											
																		<td>
                            <a href="#" data-bind="text: Message().Subject, click: function(){ViewLogic.ChangePage('Message', 'details', $data.Message().Id,'MessageExpertUser');}"></a>
                        </td>
												<td>
                            <a href="#" data-bind="text: ExpertProfile().Title, click: function(){ViewLogic.ChangePage('ExpertProfile', 'details', $data.ExpertProfile().Id,'MessageExpertUser');}"></a>
                        </td>
												<td>
                            <a href="#" data-bind="text: MessageFolder().Name, click: function(){ViewLogic.ChangePage('MessageFolder', 'details', $data.MessageFolder().Id,'MessageExpertUser');}"></a>
                        </td>
							
																		<td data-bind="text: Created">
                        </td>                        					
												<td data-bind="text: Updated">
                        </td>                        					
						                        <td>
                            <ul class="nav nav-pills" style="margin-bottom: 0px;">
                                <li class="dropdown" style="margin: 0px;"><a style="margin-top: 0px; margin-bottom: 0px;
                                        padding-bottom: 0px; padding-top: 0px;" class="dropdown-toggle" data-toggle="dropdown"
                                        href="#">Action<b class="caret"></b></a>
                                    <ul class="dropdown-menu">
                                        <li><a data-toggle="modal" href="#dialog-modal-delete" data-bind="click: function(item){ $root.Select(item); }">
                                            Delete</a></li>
                                        <li><a data-toggle="modal" href="#dialog-modal-edit" data-bind="click: function(item){ $root.Select(item); LoadParentEditData(function(){}); }">
                                            Edit</a></li>
                                        <li><a href="#" data-bind="click: function(item){ $root.Select(item); ViewLogic.ShowDetails();}">
                                            Details</a></li>                           
                                    </ul>
                                </li>
                             </ul>
                        </td>                        
                    </tr>
                </tbody>
            </table>
        </div>
    </div>
</div>
<div id="details" style="display: none;">
	<div>  
		<ul class="nav nav-tabs">
			<li class="active">
				<a href="#tab-MessageExpertUserDetails" data-toggle="tab">MessageExpertUser Details</a>				
			</li>
					</ul>
		<div  class="tab-content">
			<div id="tab-MessageExpertUserDetails"  class="tab-pane active">
    			<div data-bind="with: Entity">
						
				<label>
                	IsRead
            	</label>
            	<input type="text" id="IsRead" name="IsRead"  data-bind="value: IsRead" readonly />        		
						
				<label>
                	IsStarred
            	</label>
            	<input type="text" id="IsStarred" name="IsStarred"  data-bind="value: IsStarred" readonly />        		
						
				<label>
                	IsSender
            	</label>
            	<input type="text" id="IsSender" name="IsSender"  data-bind="value: IsSender" readonly />        		
										<label>
                	Message
            	</label>
            	<input type="text" id="Message" name="Message"  data-bind="value: Message().Subject" readonly />
							<label>
                	ExpertProfile
            	</label>
            	<input type="text" id="ExpertProfile" name="ExpertProfile"  data-bind="value: ExpertProfile().Title" readonly />
							<label>
                	MessageFolder
            	</label>
            	<input type="text" id="MessageFolder" name="MessageFolder"  data-bind="value: MessageFolder().Name" readonly />
										<label>
                	Created
            	</label>
            	<input type="text" id="Created" name="Created"  data-bind="value: Created" readonly />        								
							<label>
                	Updated
            	</label>
            	<input type="text" id="Updated" name="Updated"  data-bind="value: Updated" readonly />        								
			        	<div>
            	<button data-bind="click: ViewLogic.ShowIndex" class="btn btn-primary">
                Back To List</button>        	
    		</div>
			</div>
		</div>
				</div>
	</div>
</div>
<div id="dialog-modal-edit" class="modal hide fade" style="display: none;">
    <form data-bind="submit: ViewLogic.UpdateDialogCommit">
	<div class="modal-header">
        <a class="close" data-dismiss="modal">[x]</a>
        <h3>
            Edit MessageExpertUser</h3>
    </div>	
    <div class="modal-body" data-bind="with: Entity">
						<input type="hidden" id="Id" name="Id" data-bind="value: Id" />
						<div class="control-group">
				<label>
					Created
				</label>
				<input type="text" readonly id="Created" name="Created" data-bind="value: Created" />
			</div>
					
			<div class="control-group">
				<label>
                	IsRead
            	</label>
            	<input type="text" id="IsRead" name="IsRead" placeholder="Enter IsRead here" data-bind="value: IsRead" />
        	</div>
					
			<div class="control-group">
				<label>
                	IsStarred
            	</label>
            	<input type="text" id="IsStarred" name="IsStarred" placeholder="Enter IsStarred here" data-bind="value: IsStarred" />
        	</div>
					
			<div class="control-group">
				<label>
                	IsSender
            	</label>
            	<input type="text" id="IsSender" name="IsSender" placeholder="Enter IsSender here" data-bind="value: IsSender" />
        	</div>
			  
				<div class="control-group">
			<label>
            	Message
           	</label>
			<select id="MessageId" name="MessageId" data-bind="value: MessageId">
           	</select>
        </div>				
				<div class="control-group">
			<label>
            	ExpertProfile
           	</label>
			<select id="ExpertProfileId" name="ExpertProfileId" data-bind="value: ExpertProfileId">
           	</select>
        </div>				
				<div class="control-group">
			<label>
            	MessageFolder
           	</label>
			<select id="MessageFolderId" name="MessageFolderId" data-bind="value: MessageFolderId">
           	</select>
        </div>				
				
				</div>
        <div class="modal-footer">
        	<button class="btn" data-bind="click: ViewLogic.HideEditDialog">
            	Cancel</button>
        	<button type="submit" class="btn btn-primary">
            	Save</button>
    	</div>
    </form>
</div>
<div id="dialog-modal-delete" class="modal hide fade" style="display: none;">
	<div class="modal-header">
        <a class="close" data-dismiss="modal">[x]</a>
        <h3>
            Delete Factory</h3>
    </div>
    <div class="modal-body" data-bind="with: Entity">
        <h3>
            Do you reallt want to delete this MessageExpertUser?</h3>
    </div>
    <div class="modal-footer">
        <button class="btn" data-bind="click: ViewLogic.HideDeleteDialog">
            Cancel</button>
        <button type="submit" class="btn btn-primary" data-bind="click: ViewLogic.DeleteDialogCommit">
            Confirm Delete</button>
    </div>
</div>
<div id="dialog-modal-add" class="modal hide fade" style="display: none;">
    <form data-bind="submit: ViewLogic.SaveDialogCommit">
	<div class="modal-header">
        <a class="close" data-dismiss="modal">[x]</a>
        <h3>
            Add MessageExpertUser</h3>
    </div>
    <div class="modal-body">       
					<div class="control-group">
            	<label>
                IsRead
            	</label>
            	<input type="text" id="IsRead" name="IsRead" placeholder="Enter IsRead here" />
        	</div>			
						<div class="control-group">
            	<label>
                IsStarred
            	</label>
            	<input type="text" id="IsStarred" name="IsStarred" placeholder="Enter IsStarred here" />
        	</div>			
						<div class="control-group">
            	<label>
                IsSender
            	</label>
            	<input type="text" id="IsSender" name="IsSender" placeholder="Enter IsSender here" />
        	</div>			
								<div class="control-group">
            	<label>
                Message
            	</label>
				<select id="MessageId" name="MessageId" data-bind="value: MessageId">
            	</select>
        	</div>				
						<div class="control-group">
            	<label>
                ExpertProfile
            	</label>
				<select id="ExpertProfileId" name="ExpertProfileId" data-bind="value: ExpertProfileId">
            	</select>
        	</div>				
						<div class="control-group">
            	<label>
                MessageFolder
            	</label>
				<select id="MessageFolderId" name="MessageFolderId" data-bind="value: MessageFolderId">
            	</select>
        	</div>				
					        
    </div>
	<div class="modal-footer">
        <button class="btn" data-bind="click: ViewLogic.HideAddDialog">
            Cancel</button>
        <button type="submit" class="btn btn-primary">
            Save</button>        
    </div>
    </form>
</div>
<div id="debug" data-bind="visible: Debug">
    <hr />
    <h2>
        Debug (To turn of debugging set <i>"var debugEnabled = false;"</i> in _Layout.cshtml)</h2>
    <div data-bind="text: ko.toJSON(ViewModel)">
    </div>
</div>
